import { debounce } from "lodash-es";
import useOverlay from "@/components/Overlay/hooks/useOverlay";

export default function useInput(key: string) {
  const { toggleShow } = useOverlay();
  const inputEl = useTemplateRef<HTMLInputElement>(key);
  const setInputValue = debounce(function (): void {
    const el = unref(inputEl);
    if (el) {
      toggleShow();
    } else {
      console.warn("Input element is not available.");
    }
  }, 300);
  return {
    setInputValue
  };
}
